<!-- 
 v-text（类似 innerText）
使用语法：<p v-text="普通字符串">hello</p>
往标签中插入文本内容，类似插值表达式，使用该语法，会覆盖 p 标签原有内容
v-html
使用语法：<p v-html="富文本字符串">hello</p>
解析并显示HTML格式文本，常用于渲染富文本，使用该语法，会覆盖 p 标签原有内容 -->
<script setup lang='ts'>
 import { ref } from 'vue';
  const weather = ref('阴天') 
  const feeling=ref(`<h2><strong style="color:red">我要租房子</strong></h2>`) 
  
  const change=()=>{
      feeling.value=`<h3><strong style="color:green">租到房子了</strong></h3>`
  }
</script>
       
<template>
    <p v-text="weather"></p>
    <button @click="weather = '晴天'">转换天气</button>
    
    <p v-html="feeling"></p>
    <button @click="change">变化</button>   
</template>
       
<style scoped>
       
</style>